$(document).ready(function() {
    function carousel() {
        var pUl = $(".pictures");
        var pLi = $(".pictures li");
        pUl.innerHTML += pUl.innerHTML;
        pUl.css("width", pLi.innerWidth() * pLi.length + 'px');

        function createSwitch() {
            for (var j = 0; j < pLi.length; j++) {
                var $li = $("<li></li>");

                var $parent = $(".switchable_nav");

                $parent.append($li);
            }
        }


        createSwitch();
        var sLi = $(".switchable_nav li");
        sLi.eq(0).addClass("curr");

        var pUlWidth = pUl.css("width");
        var i = 0;
        var timer = setInterval(move, 3000);

        function move() {
            if (i == pLi.length - 1) {
                pUl.animate({
                    left: '0px'
                });
                i = 0;
            } else {
                pUl.animate({
                    left: -(pLi.width() * (i + 1))
                });
                i++;
            }
            sLi.eq(i).addClass("curr").siblings().removeClass("curr");
        }

        var index = $(this).index();
        sLi.click(function() {
            index = $(this).index();
            $(this).siblings().removeClass("curr");
            $(this).addClass("curr");
            if (index != i) {
                clearInterval(timer);
                pUl.animate({
                    left: -(pLi.width() * (index))
                });
                i = index;
                timer = setInterval(move, 3000);
            }

        });
    };
    carousel();

    var sign = $(".sign_up");
    var sctList = $(".section01 li.list_item");
    console.log(sctList.length);
    sctList.mouseover(function() {
        sctList.find(sign).css("display", "none");
        sctList.eq($(this).index()).find(sign).css("display", "inline-block");
    });
    sctList.mouseout(function() {
        sctList.find(sign).css("display", "none");
    })
})
